window.addEventListener('load', function () {
  let id = Number(location.search.split('=')[1])
  let token = getCookie('token');
  // 获取文章内容
  ajax({
    url: baseUrl + '/article/detail',
    data: {
      id
    },
    headers: { Authorization: token },
    success: function (res) {

      let time = changeTime(res.data.addtime)
      console.log(res.data.category.name)
      let html = `<div class="main">
      <div class="title">
        <p>${res.data.title}</p>
        <div class="layui-row stat">
          <div class="layui-col-md3 layui-col-xs12">发布时间：<em>${time}</em></div>
          <div class="layui-col-md2 layui-col-xs6">分类：<a href="javascript:;">${res.data.category.name}</a></div>
          <div class="layui-col-md2 layui-col-xs6">作者：<a href="javascript:;">${(res.data.nickname) ? res.data.nickname : '网友发布'}</a></div>
          <div class="layui-col-md5 layui-col-xs12">
            <div class="layui-row">
              <div class="layui-col-md6 layui-col-xs6">
                <i class="layui-icon layui-icon-reply-fill"></i>
                <em>12条评论</em>
              </div>
              <div class="layui-col-md6 layui-col-xs6">
                <i class="layui-icon layui-icon-read"></i>
                <em>点赞量：${res.data.hasLike}</em>
              </div>
            </div>
          </div>
        </div>
      </div>


      <div class="content">
        <p><img data-original="http://www.muzhuangnet.com/upload/201610/18/201610181557196870.jpg"
            src="http://www.muzhuangnet.com/upload/201610/18/201610181557196870.jpg" alt="" draggable="false"
            style="display: block;"></p>
        <p>
          ${res.data.content}
        </p>
      </div>
      
      <div class="operation">
      <button type="button" class="layui-btn layui-btn-radius layui-btn-primary are1" style="display: block;">
      <i class="layui-icon">&#xe6c6;</i> 
      点赞
      </button>
      </div>
      <div class="operation">
      <button type="button" class="layui-btn layui-btn-radius layui-btn-primary are2" style="display: none;">
      <i class="layui-icon">&#xe6c5;</i> 
      取消
      </button>
      </div>
      <div class="Label">
        <i class="layui-icon layui-icon-note"></i>
        <a href="javascript:;">${res.data.category.name}</a>
      </div>
    </div>`
    // 点赞功能
      document.querySelector('.contentDetail').innerHTML = html
     let btn1 =  document.querySelector('.are1');
     let btn2 = document.querySelector('.are2');
     if(res.data.likeCount==1){
      btn1.style.display='none';
      btn2.style.display = 'block';
     }else{
      btn2.style.display='none'
      btn1.style.display = 'block';
     }
     btn1.onclick = function(){
       btn1.style.display='none';
       btn2.style.display = 'block';
      ajax({
        url:baseUrl+'/article/like',
        data:{
          id
        },
        headers: { Authorization: token },
        success:function(res){
          layer.msg('点赞成功',{icon: 1})
        }
      })
     }
     btn2.onclick = function(){
       btn2.style.display='none'
       btn1.style.display = 'block';
       ajax({
        url:baseUrl+'/article/like',
        data:{
          id
        },
        headers: { Authorization: token },
        success:function(res){
          layer.msg('点赞取消',{icon: 2})
        }
      })
     }
      console.log(res.data)
    }
  })
})